<script setup lang="ts">
import HelloWorld from './components/HelloWorld.vue'
import initSetup from './components/1initSetup.vue'
import ref from "./components/2ref.vue";
import reactive from './components/3reactive.vue'
import toFamily from './components/4to全家桶.vue'
import Computed from './components/5计算属性.vue'
import Watch from './components/6.watch.vue'
import WatchEffect from './components/7watchEffect.vue'
import Shengmingzhouqi from './components/8生命周期.vue'
import BemAndLayout from './components/9BEM结构和layout布局.vue'
import PropsAndEmit from './components/10父子组件传参.vue'
import TemplateByAll from './components/11全局组件+局部组件+递归组件.vue'
import dongTaiTemplate from './components/12动态组件.vue'
import pinaStudy from './components/store.vue'
</script>

<template>
  <!--  <initSetup :msg="12"/>-->
  <!--  <ref></ref>-->
  <!--  <reactive></reactive>-->
  <!--  <toFamily></toFamily>-->
  <!--  <Computed></Computed>-->
  <!--  <Watch></Watch>-->
  <!--  <WatchEffect></WatchEffect>-->
<!--  <Shengmingzhouqi></Shengmingzhouqi>-->
  <!--  <BemAndLayout></BemAndLayout>-->
  <!--  <PropsAndEmit></PropsAndEmit>-->
  <!--  <TemplateByAll></TemplateByAll>-->
  <!--  <dongTaiTemplate></dongTaiTemplate>-->

  <pinaStudy></pinaStudy>
</template>

<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
